import React, { createContext, useState, useContext } from 'react';

const CountContext = createContext()
export default function () {
    return (
        <div>
            <CountContext.Provider value={{aa:'test'}}>
                <Demo1/>
                <Demo2/>
            </CountContext.Provider>

        </div>
    )
}


function Demo1 () {
    const data = useContext(CountContext)
    return (
        <div>
            demo1,{data.aa}
        </div>
    )
}
function Demo2 () {

    return (
        <div>
            demo2
            <CountContext.Consumer>
                {(data) => {
                    return (
                        <div>
                            {data.aa}
                        </div>
                    )
                }}
            </CountContext.Consumer>
        </div>
    )
}